<template>
	<view>
		<view class="nav-container">
			<uni-nav-bar :fixed="false" title="数据" color="#333333" background-color="#FFFFFF" right-icon="server-man"
				@clickLeft="showBuilding()"  @clickRight="intoService()">
				<block slot="left">
					<view class="building">
						<text class="nav-title">{{ building }}</text>
						<u-icon name="arrow-down"></u-icon>
					</view>
				</block>
			</uni-nav-bar>
			<u-picker :show="show" @close="()=>show=false" @cancel="()=>show=false" :columns="columns"
				@confirm="confirm" title="选择项目" keyName="floorName"></u-picker>
		</view>
		<view class="container">
			<view class="card">
				<advanced-label content="公建芯造"></advanced-label>
				<view class="menus">
					<view class="menu-item" @click="goToPage('项目进度')">
						<image src="/static/data_icons/1.png" class="icon"></image>
						<text class="title">项目进度</text>
					</view>
					<view class="menu-item" @click="goToPage('项目质量')">
						<image src="/static/data_icons/2.png" class="icon"></image>
						<text class="title">项目质量</text>
					</view>
					<view class="menu-item" @click="goToPage('项目安全')">
						<image src="/static/data_icons/3.png" class="icon"></image>
						<text class="title">项目安全</text>
					</view>
					<view class="menu-item" @click="goToList('项目大事记')">
						<image src="/static/data_icons/4.png" class="icon"></image>
						<text class="title">项目大事记</text>
					</view>
				</view>
			</view>
			<view class="card">
				<advanced-label content="房屋芯造"></advanced-label>
				<view class="menus">
					<view class="menu-item" @click="goToHouse('房屋进度')">
						<image src="/static/data_icons/5.png" class="icon"></image>
						<text class="title">房屋进度</text>
					</view>
					<view class="menu-item" @click="goToHouse('房屋质量')">
						<image src="/static/data_icons/6.png" class="icon"></image>
						<text class="title">房屋质量</text>
					</view>
					<view class="menu-item" @click="goToHouse('房屋安全')">
						<image src="/static/data_icons/7.png" class="icon"></image>
						<text class="title">房屋安全</text>
					</view>
					<view class="menu-item" @click="goToList('房屋节点')">
						<image src="/static/data_icons/8.png" class="icon"></image>
						<text class="title">房屋节点</text>
					</view>
				</view>
			</view>
			<view class="card">
				<advanced-label content="问题管理	"></advanced-label>
				<view class="menus">
					<view class="menu-item">
						<image src="/static/data_icons/9.png" class="icon" @click="goToQuestion('质量问题')"></image>
						<text class="title">质量问题</text>
					</view>
					<view class="menu-item">
						<image src="/static/data_icons/10.png" class="icon" @click="goToQuestion('安全问题')"></image>
						<text class="title">安全问题</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				columns: [],
				building: uni.getStorageSync('selectProject'),
			};
		},
		onLoad() {
			this.getEstate()
		},
		onShow() {
			console.log('data')
			this.building = uni.getStorageSync('selectedProject')
		},
		methods: {
			intoService() {
				uni.navigateTo({
					url: '/pages/imine/mine_service/mine_service'
				})
			},
			//获取绑定的楼盘信息
			async getEstate() {
				const {
					body
				} = await uni.$H.post('/userEstateMap/getByQuery', {
					estateType: '2',
					roleId: "4",
					userId: uni.getStorageSync('userId')
				}, {
					authCode: true
				})
				console.log(body)
				if (body.length != 0) {
					let _t = []
					for (let i = 0; i < body.length; i++) {
						_t.push(body[i].businessRealEstateVO)
					}
					this.columns = [_t]
				}
			},
			confirm(e) {
				console.log('confirm', e);
				this.building = e.value[0].floorName
				uni.setStorageSync('selectedProject', this.building)
				uni.setStorageSync("estateId", e.value[0].floorId)
				this.show = false
			},
			showBuilding() {
				this.show = true
				this.getEstate()
			},
			goToQuestion(name) {
				if (uni.getStorageSync('selectedProject') == '请选择') {
					uni.$showMsg('请先选择项目')
					return
				} else {
					uni.navigateTo({
						url: "/pages/idata/question/question_list/question_list?title=" + name
					})
				}
			},
			goToList(name) {
				if (uni.getStorageSync('selectedProject') == '请选择') {
					uni.$showMsg('请先选择项目')
					return
				} else {
					if (name == '项目大事记') {
						uni.navigateTo({
							url: "/pages/idata/note/project_list/project_list?title=" + name
						})
					} else {
						uni.navigateTo({
							url: "/pages/idata/note/house_node_list/house_node_list?title=" + name
						})
					}

				}
			},
			goToPage(name) {
				if (uni.getStorageSync('selectedProject') == '请选择') {
					uni.$showMsg('请先选择项目')
					return
				} else {
					uni.navigateTo({
						url: "/pages/idata/choose_building_item/choose_building_item?title=" + name
					})
				}
			},
			goToHouse(name) {
				if (uni.getStorageSync('selectedProject') == '请选择') {
					uni.$showMsg('请先选择项目')
					return
				} else {
					uni.navigateTo({
						url: "/pages/idata/choose_house_list/choose_house_list?title=" + name
					})
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 30rpx;

		.card {
			background-color: #FFFFFF;
			padding: 30rpx 20rpx;
			border-radius: 20rpx;
			margin-bottom: 20rpx;

			.menus {
				display: flex;
				flex-direction: row;
				padding: 30rpx 0 18rpx 0;
				justify-content: space-around;

				.menu-item {
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;

					.icon {
						width: 80rpx;
						height: 80rpx;
					}

					.title {
						margin-top: 16rpx;
						font-size: 28rpx;
						font-weight: 500;
						color: #333333;
					}
				}
			}
		}
	}

	.building {
		font-size: 28rpx;
		display: inline-flex;
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
		margin-left: 20rpx;

		.nav-title {
			width: 100rpx;
			overflow: hidden;
			/* #ifndef APP-NVUE */
			white-space: nowrap;
			text-overflow: ellipsis;
			/* #endif */
			/* #ifdef APP-NVUE */
			lines: 1;
			text-overflow: ellipsis;
			/* #endif */
		}
	}

	.nav-container /deep/ .uni-nav-bar-text {
		font-size: 36rpx;
	}
</style>
